<template>
  <div>
    <Breadcrumb :style="{margin: '24px 0'}">
        <BreadcrumbItem>首页</BreadcrumbItem>
        <BreadcrumbItem>管理员管理</BreadcrumbItem>
        <BreadcrumbItem>角色管理</BreadcrumbItem>
    </Breadcrumb>
    <Content :style="{padding: '24px', minHeight: '280px', background: '#fff'}">
        <div style="height:50px;">
          <div style="float:left">
            <Button type="primary" @click="addRole()">添加角色</Button>
          </div>
          <div style="float:right;">
            <Button icon="ios-search" style="float:right;margin-left:5px;" @click="getpage()">Search</Button>
            <Input v-model="search" style="float:right;width:250px;"></Input>
          </div>
        </div>
        <div>
          <Table border ref="selection" :columns="columns7" :data="data6"></Table><br>
          <span style="align:center" >
            <span v-if = "$route.query.page == undefined ">
              <Page :total="page" :page-size="10" :current="1"  @on-change="getpage" ></Page>
            </span>
            <span v-else>
              <Page :total="page" :page-size="10" :current="parseInt($route.query.page)"  @on-change="getpage" ></Page>
            </span>
          </span>
        </div>

    </Content>
    <!-- 弹出框代码start -->
    <Modal
        v-model="modal1"
        @on-ok="ok"
        @on-cancel="cancel">
        <p class="modeldel">是否删除当前角色？</p>
    </Modal>
    <!-- 弹出框代码end -->

    <!-- 弹出框代码start -->
      <Modal v-model="addbrand" @on-ok="ok_addRole" @on-cancel="cancel_addRole" title="添加管理员角色">
          <div class="modeldiv">
            <p class="catename"><b>角色名称</b></p>
            <Input  placeholder="请输入角色名称" style="width: 300px" v-model="role_name"></Input><br><br>
          </div>
      </Modal>
    <!-- 弹出框代码end -->


  </div>
</template>
<style scoped>
  .modeldel{
    font-size: 20px;
  }
</style>
<script>
import adminrole from '@/assets/js/views/admin/adminrole';

export default {
  ...adminrole,
};
</script>

